<template>
	<view>
		<UserInfoCard></UserInfoCard>
		<view class='page-container'>
			<template v-if="dataSource && dataSource.length">
				<view v-for="(item,index) in dataSource">
					<view class="item">
						<view class="start-center">
							<view class="patientType-1" v-if="item.patientType==1">未入院</view>
							<view class="patientType-2" v-if="item.patientType==2">住院中</view>
							<view class="patientType-3" v-if="item.patientType==3">已出院</view>
						</view>
						<view class="between-center">
							<view class="start-center">
								<image class="img-bingqu" src="/static/images/imgs/zhuyuanqingdan-bingqu.png"></image>
								<view class="mar-5">{{item.theHospitalWard}}</view>
							</view>
							<view>
								<view class="start-center" v-if="item.patientType==1">
									<view></view>
									<view class="color-red">￥{{item.totalAmount}}</view>
								</view>
								<view class="start-center" v-if="item.patientType==2">
									<view>预交押金余额：</view>
									<view class="color-red">￥{{item.currentBalance}}</view>
								</view>
								<view class="start-center" v-if="item.patientType==3">
									<view>总费用：</view>
									<view class="color-red">￥{{item.totalAmount}}</view>
								</view>
							</view>
						</view>
						<view class="pad-0-16r">
							<view class="between-center">
								<view class="start-center">
									<view class="item-title">住院患者</view>
									<view>{{item.patName}}</view>
								</view>

							</view>
							<view class="start-center">
								<view class="item-title">住院号</view>
								<view>{{item.admissionNo}}</view>
							</view>
							<view class="start-center">
								<view class="item-title">住院院区</view>
								<view>{{item.birthPlace}}</view>
							</view>
							<view class="start-center">
								<view class="item-title">住院科室</view>
								<view>{{item.deptName}}</view>
							</view>
							<view class="start-center">
								<view class="item-title">入院日期</view>
								<view>{{item.inHospitalTime}}</view>
							</view>
							<view class="start-center" v-if="item.patientType==3">
								<view class="item-title">出院日期</view>
								<view>{{item.outHospitalTime}}</view>
							</view>
						</view>
						<ButtonAllVue v-if="item.patientType==3" btn-l="住院清单" @cancel="toListDetailPage(item)"
							btn-r="出院带药" @click="toOutHospitalMedicalPage(item)">
						</ButtonAllVue>
						<ButtonAllVue v-if="item.patientType==2" btn-l="住院清单" @cancel="toListDetailPage(item)">
						</ButtonAllVue>
					</view>
				</view>

			</template>
			<u-empty v-else text="暂无数据" mode="favor" style="margin-top: 100rpx;"></u-empty>
		</view>
		<LoadVue :load="load"></LoadVue>
	</view>
</template>

<script>
	import UserInfoCard from '../../../components/UserInfo/UserInfoCard.vue'
	import FilterButton from '../../../components/FilterButton/FilterButton.vue'
	import ButtonAllVue from '../../../components/Button/ButtonAll.vue'
	import {
		mapGetters
	} from 'vuex'
	import {
		inHospitalByCardType,
		inHospitalBeInlist
	} from '../../../api/inHospital'
	import {
		dateFormat,
		getPastDate
	} from '../../../utils/assist'
	export default {
		components: {
			UserInfoCard,
			FilterButton,
			ButtonAllVue,
		},
		computed: {
			...mapGetters(["userInfo"]),
		},
		data() {
			return {
				dataSource: [],
				load: false,
			}
		},
		mounted() {
			this.init()
		},
		methods: {
			init() {
				this.load = true
				inHospitalByCardType({
					// queryValue: this.userInfo.patId,
					queryValue: "22499",
					queryType: '8',
					patType: '2', //患者类型 1门诊2住院
				}).then(res => {
					console.log(res)
					if (res.length > 0) {
						this.dataSource = res;
					} else {
						this.dataSource = [];
					}

				}).finally(() => {
					this.load = false
				})
			},
			toListDetailPage(item) {
				// 跳转到住院清单详情
				uni.navigateTo({
					url: `/pages/Home/ServeHospital/InHospitalListDetail?item=` + JSON.stringify(item)
				})
			},
			toOutHospitalMedicalPage(item) {
				// 跳转到出院带药
				uni.navigateTo({
					url: `/pages/Home/ServeHospital/LeaveHospitalMedication?item=` + JSON.stringify(item)
				})
			},
		}
	}
</script>

<style lang='scss' scoped>
	.page-container {
		padding: 16rpx;
	}

	.img-bingqu {
		width: 20px;
		height: 20px;
	}

	.patientType-1 {
		background: rgb(153, 153, 153);
		padding: 3px 20px;
		border-radius: 45px 0 45px 0;
		color: white;
	}

	.patientType-2 {
		background: rgb(252, 80, 68);
		padding: 3px 20px;
		border-radius: 45px 0 45px 0;
		color: white;
	}

	.patientType-3 {
		background: #0cbd30;
		padding: 3px 20px;
		border-radius: 45px 0 45px 0;
		color: white;
	}
</style>